<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>商品详情</title>
		<link rel="stylesheet" href="./font_o7i7jdehmgt/iconfont.css">
        <link rel="stylesheet" href="./css/bootstrap.min.css">
        <link rel="stylesheet" type="text/css" href="./css/details.css" />
        <link rel="shortcut icon" href="./favicon.ico" />
	</head>
    <script src="./js/jquery.min.js"></script>
	<script src="./node_modules/layui-layer/dist/layer.js"></script>
    <script src="./js/tools.js"></script>
	<script src="./js/details.js"></script>
	<body>
		<!-- return -->
		<div class="return">
			<li>
				<span class="iconfont icon-shouji"></span>
				<p>手机APP</p>
			</li>
			<li>
				<span class="iconfont icon-app_icons--
				"></span>
				<p>个人中心</p>
			</li>
			<li>
				<span class="iconfont icon-shouhou"></span>
				<p>售后服务</p>
			</li>
			<li>
				<span class="iconfont icon-kefu"></span>
				<p>人工客服</p>
			</li>
			<li>
				<span class="iconfont icon-gouwuche"></span>
				<p>购物车</p>
			</li>
			<li class="fanhui">
				<span class="iconfont icon-fanhuidingbu"></span>
				<p>返回顶部</p>
			</li>
		</div>
		<!-- header -->
		<div class="header-big">
			<div class="header">
				<div class="header-l">
					<ul>
						<li><a href="#">小米商城</a></li>
						<li><a href="#">MIUI</a></li>
						<li><a href="#">loT</a></li>
						<li><a href="#">云服务</a></li>
						<li><a href="#">天星科技</a></li>
						<li><a href="#">有品</a></li>
						<li><a href="#">小爱开放平台</a></li>
						<li><a href="#">企业团购</a></li>
						<li><a href="#">资质证照</a></li>
						<li><a href="#">协议规则</a></li>
						<li class="download">
                            <a href="#">下载app</a>
                            <div class="download-slide">
                                <img src="./images/download.png" alt="">
                                <p>小米商城APP</p>
                            </div>
                        </li>
						<li><a href="#">智能生活</a></li>
						<li><a href="#">Select Location</a></li>
					</ul>
                    <ol>
                        <li class="myself">
                            <a href="#">简小约 &nbsp; ^</a>
                            <div class="myself-slide">
                                <p>个人中心</p>
                                <p>晒单评价</p>
                                <p>我的喜欢</p>
                                <p>小米账户</p>
                                <p>退出登录</p>
                            </div>
                        </li>
						<li><a href="#">消息通知</a></li>
						<li><a href="#">我的订单</a></li>
                    </ol>
				</div>
				<div class="header-r">
					<span class="iconfont icon-gouwuche"></span>
					<span class="header-rp">购物车（0）</span>
					<div class="header-slide">购物车中还没有商品，赶紧选购吧！</div>
				</div>
			</div>
		</div>
        <!-- nav -->
		<div class="nav-big">
			<div class="nav">
				<div class="nav-logo">
					<a href="./xiaomi.html" title="小米官网"><img src="./imgs/4.jpg.png"></a>
				</div>
				<div class="nav-m">
					<li><a href="#">小米手机</a></li>
					<li><a href="#">Redmi 红米</a></li>
					<li><a href="#">电视</a></li>
					<li><a href="#">笔记本</a></li>
					<li><a href="#">平板</a></li>
					<li><a href="#">家电</a></li>
					<li><a href="#">路由器</a></li>
					<li><a href="#">智能硬件</a></li>
					<li><a href="#">服务</a></li>
					<li><a href="#">社区</a></li>
				</div>
				<div class="nav-r">
					<div class="nav-r1">
						
					</div>
					<div class="nav-pic">
						<span class="iconfont icon-fangdajing"></span>
					</div>
				</div>
			</div>
        </div>
        <!-- main -->
        <div class="main-top">
            <!-- 商品放大镜功能 -->
            <div class="magnifier-big">
                <div class="magnifier">
                    <img src="" class='magnifier-img'>
                    <div class="mask"></div>
                    <div class="big">
                        <img src="" alt="">
                    </div>
                </div>
                <div class="goods">
                    <h3></h3>
                    <div class="goods-title"></div>
                    <p>小米自营</p>
                    <div class="goods-price">
                        商品价格:<span></span> 元
                    </div>
                    <div class="address">
                        <img src="./images/address.png" alt="">
                    </div>
                    <div class="goods-color">
                        <p>选择商品种类：</p>
                        <div class="color1"></div>
                        <div class="color2"></div>
                    </div>
                    <div class="shoppingbtn">
                        <button class="btn btn-danger shopping">添加喜欢</button>
                        <button class="btn btn-warning addcart">加入购物车</button>
                        <a href="./Shopping_Cart.html"><button class="btn btn-success addcart">立即结算</button></a>
                    </div>
                    <div class="ensure">
                        <span class="iconfont icon-app_icons--">小米自营</span>
                        <span class="iconfont icon-app_icons--">小米发货</span>
                        <span class="iconfont icon-app_icons--">7天无理由退货</span>
                        <span class="iconfont icon-app_icons--">运费说明</span>
                        <span class="iconfont icon-app_icons--">企业信息</span>
                        <span class="iconfont icon-app_icons--">30天价格保护</span>
                    </div>
                </div>
                <div class="tab">
                    <ul>
                        <li class="active">商品详情</li>
                        <li>商品评价</li>
                    </ul>
                    <ol>
                        <li class="active"></li>
                        <li></li>
                    </ol>
                </div>
            </div>
            <!-- official -->
            <div class="official-big">
                <div class="official-title">官方微信</div>
                <div class="official">
                    <img src="./images/weixin.png" alt="">
                    <div class="official-info">
                        <li><span class="iconfont icon-kefu"></span>人工在线客服</li>
                        <li><span class="iconfont icon-shouji"></span>获取新品资讯</li>
                        <li><span class="iconfont icon-shouhou"></span>定期发送福利</li>
                        <li><span class="iconfont icon-gouwucheman"></span>商品优惠信息</li>
                    </div>
                    <img src="./images/download.png" width="120px">
                </div>
            </div>
            <!-- explain -->
            <div class="explain-big">
                <div class="explain-title">价格说明</div>
                <div class="explain">
                    <div class="explain-info"><span>划线价:</span>商品展示的划横线价格为参考价,该价格可能是品牌专柜标价、商品吊牌价或由品牌供应商提供的正品零售价
                        (如厂商指导价、建议零售价等)或该商品在小米商城/小米有品/天猫小米官方旗舰店曾经展示过的销售价;由于地
                        区、时间的差异性和市场行情波动,品牌专柜标价、商品吊牌价等可能会与您购物时展示的不一致, 该价格仅供您参考。
                    </div>
                </div>
            </div>

        </div>

        <!-- service -->
        <div class="service-big">
            <div class="service">
                <div class="service-top">
                    <div class="service-top1">
                        <img src="imgs/xiaomi3_68.png" class="service-top1-pic">
                        <p class="service-top1-p">预约维修服务</p>
                    </div>
                    <div class="service-top1">
                        <img src="imgs/xiaomi3_70.png" class="service-top1-pic">
                        <p class="service-top1-p">7天无理由退货</p>
                    </div>
                    <div class="service-top1">
                        <img src="imgs/xiaomi3_72.png" class="service-top1-pic">
                        <p class="service-top1-p">15天免费换贷</p>   
                    </div>
                    <div class="service-top1">
                        <img src="imgs/xiaomi3_75.png" class="service-top1-pic">
                        <p class="service-top1-p">满150元包邮</p>
                    </div>
                    <div class="service-top1 service-top2">
                        <img src="imgs/xiaomi3_78.png" class="service-top1-pic">
                        <p class="service-top1-p">520余家售后网点</p>
                    </div>
                </div>
                <div class="service-bot">
                    <div class="bot-nav">
                        <div class="bot-nav1">
                            <ul>
                                <li><a href="">帮助中心</a></li>
                                <li><a href="">服务支持</a></li>
                                <li><a href="">线下门店</a></li>
                                <li><a href="">关于小米</a></li>
                                <li><a href="">关于我们</a></li>
                                <li><a href="">特色服务</a></li>
                            </ul>
                        </div>
                        <div class="bot-nav2">
                            <ul>
                                <li>账户管理</li>
                                <li>售后政策</li>
                                <li>小米之家</li>
                                <li>了解小米</li>
                                <li>新浪微博</li>
                                <li>F 码通道</li>
                                <li>购物指南</li>
                                <li>自助服务</li>
                                <li>服务网点</li>
                                <li>加入小米</li>
                                <li>官方微信</li>
                                <li>礼物码</li>
                                <li>订单操作</li>
                                <li>相关下载</li>
                                <li>授权体验</li>
                                <li>投资关系</li>
                                <li>联系我们</li>
                                <li>防伪查询</li>
                            </ul>
                        </div>
                    </div>
                    <div class="bot-right">
                        <p class="bot-right-p1">400-100-5678</p>
                        <p class="bot-right-p2">周一至周日 8:00-18:00</p>
                        <p class="bot-right-p3">(仅收市话费)</p>
                        <img src="imgs/xiaomi3_86.png" >
                    </div>
                </div>
            </div>
        </div>
    <!-- footer -->
        <div class="footer-big">
            <div class="footer">
                <div class="footer-logo">
                    <img src="./imgs/80_03.png" >
                </div>
                <div class="footer-info">
                    <p class="footer-info1">小米商城 | MIUI | 米家 | 米聊 | 多看 | 游戏 | 路由器 |米粉卡 | 政企服务 | 小米天猫店 | 隐私政策 | 问题反馈 | Select Region</p>
                    <p class="footer-info2">@mi.com京ICP证110507号京ICP备10046444号京公网安备11010802020134号京网文[2017]1530-131号</p>
                    <p class="footer-info3">违法和不良信息举报电话: 185-0130-1238. 本网站所列数据，除特殊说明，所有数据均出自我司实验室测试</p>
                </div>
            </div>
            <div class="footer-r">
                <p class="footer-p1">诚信经营<br>放心消息</p>
                <img src="imgs/xiaomi3_97.png" >
                <p class="footer-p1">网上交易<br>保障中心</p>
                <img src="imgs/xiaomi3_95.png" >
                <p class="footer-p1">可信网站<br>信用评价</p>
                <img src="imgs/xiaomi3_92.png" >
                <p class="footer-p1">诚信网站<br>示范企业</p>
                <img src="imgs/xiaomi3_89.png" >
            </div>
            <div class="footer-xiaomi">
                让全球每个人都能享受科技带来的美好生活！
            </div>
        </div>
    </body>
</html>
    